<template>
  <div>
    <BasicTable @register="registerTable">
      <template #toolbar>
        <a-button type="primary" @click="exportData">导出</a-button>
      </template>
    </BasicTable>
  </div>
</template>
<script lang="ts">
  import {defineComponent} from 'vue';
  import {BasicTable, useTable} from '/@/components/Table';
  import {electronicGoldPage} from './api';
  import {columns, searchFormSchema} from './data';
  import {exportExcel} from './api';

  export default defineComponent({
    name: 'bcrManagement',
    components: {BasicTable},
    setup() {
      const [registerTable] = useTable({
        title: '苏南电子金',
        api: electronicGoldPage,
        columns,
        formConfig: {
          labelWidth: 120,
          schemas: searchFormSchema,
        },
        useSearchForm: true,
        showTableSetting: true,
        bordered: true,
        showIndexColumn: false
      });

      function exportData() {
        exportExcel({}).then(data => {
          let url = window.URL.createObjectURL(new Blob([data], {type: 'application/vnd.ms-excel'}))
          let link = document.createElement('a')
          link.style.display = 'none'
          link.href = url
          link.setAttribute('download', '电子金记录.xls')
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link); //下载完成移除元素
          window.URL.revokeObjectURL(url); //释放掉blob对象
        })
      }


      return {
        registerTable,
        exportData
      };
    },
  });
</script>
